<template>
  <div 
  :class="{'innerPageTable-box-OneTwo': !useTableSearchBar}"
  class="innerPageTable-out-flex">
    <!-- 搜索区域 -->
    <SelfAdaption v-if="!useTableSearchBar">
      <Form
        :model="searchForm"
        ref="searchForm"
        :rules="rule"
        slot="adaption-bar"
        label-position="top"
        class="ivu-form-no-margin-bottom"
        inline
      >
        <template>
          <!-- 维度编码 -->
          <Form-item prop="dimensionCode" :label="$t('module.dimension.dimensionCode')">
            <Input
              type="text"
              :maxlength="30"
              v-model.trim="searchForm.dimensionCode"
              :placeholder="$t('module.dimension.warning.enterCode')"
              @on-enter="search"
            ></Input>
          </Form-item>

          <!-- 维度名称 -->
          <Form-item prop="dimensionName" :label="$t('module.dimension.dimensionName')">
            <Input
              type="text"
              :maxlength="30"
              v-model.trim="searchForm.dimensionName"
              :placeholder="$t('module.dimension.warning.enterName')"
              @on-enter="search"
            ></Input>
          </Form-item>

          <!-- 查询\重置按钮 -->
          <Form-item prop="button" class="search-solt-btn">
            <RPButton optType="search" @click="search" />
            <RPButton optType="reset" @click="reset" />
          </Form-item>
        </template>
      </Form>
    </SelfAdaption>
    <InnerPageTable ref="dimensionTable" :config="dimensionConfig">
      <!-- handler bar 查询/重置-->
      <!--
      <div slot="handle-bar">
        <RPButton optType="search" @click="search" />
        <RPButton optType="reset" @click="reset" />
      </div>
      -->
      <!-- table bar 添加-->
      <div slot="table-bar">
        <RPButton optType="create" @click="addOrEdit" />
        <RPButton optType="batch" @click="deleteDimension(null)" />
      </div>
      <Form
        :model="searchForm"
        v-if="useTableSearchBar"
        ref="searchForm"
        :rules="rule"
        slot="table-search-bar"
        label-position="top"
        class="ivu-form-no-margin-bottom"
        inline
      >
        <template>
          <!-- 维度编码 -->
          <Form-item prop="dimensionCode">
            <Input
              type="text"
              :maxlength="30"
              v-model.trim="searchForm.dimensionCode"
              :placeholder="$t('module.dimension.warning.enterCode')"
              clearable
              @on-enter="search"
              @on-blur="search"
              @on-clear="search"
            ></Input>
          </Form-item>

          <!-- 维度名称 -->
          <Form-item prop="dimensionName">
            <Input
              type="text"
              :maxlength="30"
              v-model.trim="searchForm.dimensionName"
              :placeholder="$t('module.dimension.warning.enterName')"
              clearable
              @on-enter="search"
              @on-blur="search"
              @on-clear="search"
            ></Input>
          </Form-item>
        </template>
      </Form>
    </InnerPageTable>
  </div>
</template>

<script>
import {
  getDimensionList,
  getDimensionDetail,
  addDimension,
  delDimension,
  updateDimension
} from '@/api/dimensionApi.js'
import { mainColumns } from './columns.js'
import locales from './locales.js'
import { CoreModuleName } from '@/const.js'
import DimensionEdit from './DimensionEdit'
import DataSourceList from './DimensionDataSourceList'
import valueSetAPI from '@/api/valueSetAPI.js'

export default {
  name: 'dimension-manage',
  mixins: [locales],
  data: () => ({
    productList: [],
    searchForm: {
      productId: '',
      dimensionCode: '',
      dimensionName: ''
    },
    rule: {}
  }),
  computed: {
    dimensionConfig() {
      return {
        loadDataFn: getDimensionList,
        columnsFn: mainColumns.bind(this),
        rowClassNameFn: this.rowClassName // 自定义行样式
      }
    }
  },
  mounted() {
    this.init()
  },
  created() {
    this.initProduct()
  },
  methods: {
    // 自定义行样式
    rowClassName(row) {
      //isShowAsh:1-灰化，0-不灰化
      if (row.isShowAsh == 1) {
        return 'tableDisableStyle'
      }
    },
    init() {
      const { currentPost } = $store.state[CoreModuleName]
      if (!currentPost) return

      // 根据当前岗位查询数据
      this.searchForm.productId = currentPost.productId
      this.searchForm.tenantCode = currentPost.tenantCode
      this.initProduct()
    },
    // 初始化所属产品
    initProduct() {
      valueSetAPI.getValueSetByCode('RC_PRODUCT').then(data => {
        for (const product of data) {
          this.productList[product.vsiKey] = product.vsiValue
        }
        this.search()
      })
    },

    search(page = 1) {
      this.$refs['dimensionTable'].load(this.searchForm, page)
    },
    reset(page) {
      this.$refs['searchForm'].resetFields()
      this.search(1)
    },
    addOrEdit(dimension, isEdit) {
      new this.$pageModal(
        DimensionEdit,
        {
          props: {
            productId: this.searchForm.productId,
            dimensionId: isEdit ? dimension.id : ''
          }
        },
        data => {
          if (data) this.search(this.$refs.dimensionTable.param.pageNum)
        }
      )
    },
    editDataSource(dimension) {
      new this.$sidelipPage(
        DataSourceList,
        {
          props: {
            tenantCode: this.searchForm.tenantCode,
            dimension: dimension
          }
        },
        data => {
          this.search()
          // if (data) this.search();
        }
      )
    },
    deleteDimension(row) {
      let selectedIds
      if (row) {
        selectedIds = [row.id]
      } else {
        selectedIds = this.getSelectedIds()
        if (selectedIds.length == 0) {
          this.$message.error({
            content: this.$t('module.dimension.warning.selectDimension'),
            duration: 3
          })
          return
        }
      }
      // const selectedIds = this.getSelectedIds();
      // if (selectedIds.length == 0) {
      //   this.$message.error({
      //     content: this.$t("module.dimension.warning.selectDimension"),
      //     duration: 3
      //   });
      //   return;
      // }
      new $confirm(`${this.$t('common.confirmDeletion')}`, this).then(() => {
        delDimension(selectedIds)
          .then(res => {
            this.$message.success({
              content: this.$t('module.dimension.warning.deleteSuccessfully'),
              duration: 3
            })
            this.search()
          })
          .catch(data => {
            this.$message.error({
              content: data.message,
              duration: 3
            })
          })
      })
    },
    getSelectedIds() {
      let list = this.$refs['dimensionTable'].getSelectioned() || []
      let ids = []
      for (let u of list) {
        ids.push(u.id)
      }
      return ids
    }
  }
}
</script>
